<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>常见标签</title>
</head>

<body>
    <!-- 基础标签的使用 -->
    <!-- div标签 -->
    <div style="width: 200px;height: 100px;background-color: aquamarine;">这是div</div>
    <!-- h标签 -->
    <h1>这是h1</h1>
    <h2>这是h2</h2>
    <h3>这是h3</h3>
    <!-- ul,li标签 -->
    <ul>
        <dt>无序</dt>
        <li>无序列表1</li>
        <li>无序列表2</li>
        <li>无序列表3</li>
        <li>无序列表4</li>
    </ul>
    <!-- ol,li标签 -->
    <ol>
        <dt>有序</dt>
        <li>有序列表1</li>
        <li>有序列表2</li>
        <li>有序列表3</li>
        <li>有序列表4</li>
        <li>有序列表5</li>
    </ol>
    <ul>
        <li>
            <ul>
                <li>1.1</li>
                <li>1.2</li>
                <li>1.3</li>
            </ul>
        </li>
        <li>
            <ul>
                <li>2.1</li>
                <li>2.2</li>
                <li>2.3</li>
            </ul>

        </li>
        <li>
            <ul>
                <li>3.1</li>
                <li>3.2</li>
                <li>3.3</li>
            </ul>

        </li>
    </ul>
    <!-- dl,dt,dd标签 -->
    <dl>
        <dt>标题1</dt>
        <dt>标题2</dt>
    </dl>
    <!-- br标签 -->
    <br title="br标签">这是换行符br<br>
    <!-- hr标签 -->
    <hr>
    这是分割线
    <hr>
    <!-- a标签 -->
    <a href="https://www.baidu.com/">当前窗口跳转到百度界面</a><br>
    <!-- img标签 -->
    <img title="这是百度logo" src="https://www.baidu.com/favicon.ico" alt=""><br>
    <img src="https://www.baidu.com/faicon.ico" alt="该图片未上传成功">
    <p style="width: 200px;height: 100px;background-color:blueviolet;">
        段落1
        段落2
    </p>
</body>

</html>